<!--
 * @Date: 2023-02-24 17:31:06
 * @LastEditTime: 2023-03-18 13:07:34
 * @FilePath: /hua-fei-chong-zhi/src/components/rework/Rimage/Rimage.vue
 * 介绍:
-->
<script lang="ts" setup>
const props = withDefaults(
  defineProps<{
    src?: string;
    fit?: "contain" | "cover" | "fill" | "none" | "scale-down";
    position?: "left" | "center" | "right" | "top" | "bottom";
    alt?: string;
    width?: StrNumber;
    height?: StrNumber;
    radius?: StrNumber;
    round?: boolean;
    block?: boolean;
    lazyLoad?: boolean;
    showError?: boolean;
    showLoading?: boolean;
    errorIcon?: string;
    loadingIcon?: string;
    iconSize?: StrNumber;
    iconPrefix?: string;
  }>(),
  {
    showError: true,
    showLoading: true,
    position: "center",
    fit: "contain",
  }
);
const emit = defineEmits<{
  (e: "load", v: Event): void;
  (e: "error"): void;
  (e: "click", v: MouseEvent): void;
}>();
</script>

<template>
  <van-image
    v-bind="props"
    class="Rimage"
    @load="(e) => emit('load', e)"
    @error="emit('error')"
    @click="(e) => emit('click', e)"
  >
    <template v-slot:loading>
      <slot name="loading"><van-loading type="spinner" /></slot>
    </template>
    <slot></slot>
  </van-image>
</template>

<style lang="less" scoped></style>
